<template>
  <div id="app" class="container">
    <header class="headre">
    <swiper class="swiper" circular="true" autoplay="true" interval="2000" duration="1000">
      <block v-for="(item, index) in movies" :index="index" :key="item">
        <swiper-item>
          <image :src="item.url" class="slide-image" mode="aspectFill" />
        </swiper-item>
      </block>
    </swiper>
    </header>
    <div class="main" style="padding:40rpx;">
      <div v-for="(itemd,idx) of announcement" :key="idx" class="bigimg list" @click="Notificationpage(itemd.ID)">
        <div style="position: relative;flex: 1;position: relative;" >
          <div class="dain" v-show="itemd.type!=='已查看'"></div>
          <img
            class="data-img"
            v-show="itemd.type!=='已查看'"
            src="https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/message_email.png"
            alt
          />
          <img
            class="data-img"
            v-show="itemd.type==='已查看'"
            src="https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/message_system.png"
            alt
          />
        </div>
          <div style="padding-left:40rpx; flex:5">
            <div style="display:flex; margin-bottom:20rpx;" >
              <span style="flex:1; font-weight: bold;">{{itemd.title}}</span>
              <span class="text-color-BDBDBD">{{itemd.time}}</span>
            </div>
            <p style="height: 92rpx; " class="txte" v-text="itemd.t"></p>
          </div>
        </div>
      </div>
    </div>
</template>

<script>
import { getuser } from '../../utils/storage'
import { request, wxlogin } from '../../utils/https'
import { getschoolannouncementpushstudent } from '../../utils/interfaces'
import * as moment from 'moment'
export default {
  data () {
    return {
      movies: [
        {
          url:
            'https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/banner@2x.png'
        },
        {
          url:
            'https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/banner@2x.png'
        },
        {
          url:
            'https://hterobot-kimage.oss-cn-qingdao.aliyuncs.com/images1/banner@2x.png'
        }
      ],
      announcement: []
    }
  },
  onShow () {
    this.start()
  },
  methods: {
    async start () {
      try {
        const { ID } = await getuser('user')
        let code = await wxlogin()
        const data = await request(getschoolannouncementpushstudent, {
          data: {
            schoolstudentid: ID,
            code
          }
        })
        for (let v of data) {
          v.t = this.getSimpleText(v.text)
          v.time = moment(v.createdAt).format('MM-DD')
          v.type = v.schoolannouncementpushstudent[0].type
        }
        this.announcement = data
      } catch (err) {
        console.log(err)
        wx.showModal({
          title: '提示',
          content: '服务器请求失败，点击确定重新加载',
          success: res => {
            if (res.confirm) {
              this.start()
            } else if (res.cancel) {
              console.log('用户点击取消')
            }
          }
        })
      }
    },
    Notificationpage (v) {
      wx.navigateTo({
        url: `../../pages/newNotice/main?ID=${v}`
      })
    },
    getSimpleText (html) {
      var re1 = new RegExp('<.+?>', 'g') // 匹配html标签的正则表达式，"g"是搜索匹配多个符合的内容
      var msg = html.replace(re1, '') // 执行替换成空字符
      return msg.slice(0, 25)
    }
  }
}
</script>
